var citysArr = ['北京', '上海', '天津', '重庆', '河北', '山西', '河南', '辽宁', '吉林', '黑龙江', '内蒙古', '江苏', '山东', '安徽', '浙江', '福建', '湖北', '湖南', '广东', '广西', '江西', '四川', '海南', '贵州', '云南', '西藏', '陕西', '甘肃', '青海', '宁夏', '新疆', '港澳', '台湾', '钓鱼岛', '海外']
window.onload = function () {
    let ul = document.querySelector('#header .city');
    for (let i = 0; i < citysArr.length; i++) {
        let li = document.createElement('li');
        li.className = 'fl';
        let a = document.createElement('a');
        a.innerHTML = citysArr[i];
        li.appendChild(a);
        ul.appendChild(li);
    }
    // 初始位置的移入移除效果
    let address = document.querySelector('#header .address');
    let city = document.querySelector('#header .city');
    address.addEventListener('mouseover',function(){
        address.style.backgroundColor = '#fff';
        city.style.display = 'block';
    })
    address.addEventListener('mouseout',function(){
        address.style.backgroundColor = '';
        city.style.display = 'none';
    })
    // 城市位置选择时的效果显示
    let lis = document.querySelectorAll('#header .city li');
    let showspan = address.querySelector('span');
    lis.forEach(function (v) {
        let cityChange = v.querySelector('a');
        cityChange.className = 'showColor';
        cityChange.onclick = function () {
            showspan.innerHTML = '' + this.innerHTML;
        }
    })

}